@extends('admin/common')

@section('content')
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i>
        {{ $now_nav[0]['name'] }} <span class="c-gray en">&gt;</span>
        {{ $now_nav[1]['name'] }}
        <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>
    </nav>
    <div class="page-container">
        <div class="text-c">
            <select name="search_status" id="search_status">
                <option value="">用户状态类型</option>
                <option value="0">待审核</option>
                <option value="1">通过</option>
                <option value="2">未通过</option>
            </select>
            日期范围：
            <input type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'datemax\')||\'%y-%M-%d\'}' })" id="datemin" class="input-text Wdate" style="width:120px;">
            -
            <input type="text" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'datemin\')}',maxDate:'%y-%M-%d' })" id="datemax" class="input-text Wdate" style="width:120px;">
            <input type="text" class="input-text" style="width:250px" placeholder="输入会员名称、电话、邮箱" id="serach_name" name="">
            <button id="search_btn" type="button" class="btn btn-success radius" name=""><i class="Hui-iconfont">&#xe665;</i> 搜用户</button>
        </div>
        <div class="cl pd-5 bg-1 bk-gray mt-20"> <span class="l"><a href="javascript:;" onclick="datadel()" class="btn btn-danger radius"><i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a> <a href="javascript:;" onclick="member_add('添加用户','800')" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i> 添加用户</a></span> </div>
        <div class="mt-20">
            <table class="table table-border table-bordered table-hover table-bg table-sort" id="memberTable">
                <thead>
                <tr>
                    <th><input type="checkbox" name="" value=""></th>
                    <th>ID</th>
                    <th>用户名</th>
                    <th>手机</th>
                    <th>加入时间</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>

                </tbody>
            </table>
        </div>
    </div>
    @endsection

@section('script')
    <script type="text/javascript" src="{{ asset('admin/lib/My97DatePicker/4.8/WdatePicker.js') }}"></script>
    <script type="text/javascript" src="{{ asset('admin/lib/datatables/1.10.0/jquery.dataTables.min.js') }}"></script>
    <script type="text/javascript" src="{{ asset('admin/lib/laypage/1.2/laypage.js') }}"></script>
    <script type="text/javascript" src="{{ asset('admin/dataTables.fz.js') }}"></script>
    <script type="text/javascript">
        dataTab();
        $(function () {
            $('#search_btn').click(function(){
                //清空所有表格
                dataTable_val.fnDraw();
            });
        });

        function dataTab(){
            //封装databtales函数 ,参数1:为表单对象, 2:为config配置对象, 3:数据操作对象
            var config = {
                // "searching": true,    //搜索
                "ordering" : true,
                //排序
                "order": [
                    [1, 'desc'],
                ]
            };
            var ajaxOp = {
                "ajax": {
                    "url" : "{{ URL::to('admin/member/indexPost') }}",
                    "dataType" : 'json',
                    "type" : "POST",
                    "data" : function(d){
                        //合成默认提交的
                        return $.extend( {}, d, {
                            "serach_name": $('#serach_name').val(),
                            'time_start' : $('#datemin').val(),
                            'time_end' : $('#datemax').val(),
                            'search_status' : $('#search_status').find('option:selected').val(),
                        } );
                    },
                },
                //数据项
                "aoColumns": [
                    { "data": "id" ,"bSortable": false},
                    { "data": "id" },
                    { "data": "name", "bSortable": false },
                    { "data": "mobile", "bSortable": false },
                    { "data": "created_at" },
                    { "data": "status", "bSortable": false },
                    { "data": "id", "bSortable": false }
                ],
                //自定义数据项
                'columnDefs' : [
                    {
                        "render" : function(data, type, row){
                            return '<input type="checkbox" value="'+data+'" name="ids">';
                        },
                        "targets" : 0
                    },
                    {
                        "render" : function(data, type, row){
                            if(data == 1){
                                return '通过';
                            }else if(data == 2){
                                return '未通过';
                            }else{
                                return '待审核';
                            }
                        },
                        "targets" : 5
                    },
                    {
                        "render" : function(data, type, row){
                            var html = '<a title="编辑" href="javascript:;" onclick="member_edit(\'用户编辑\','+data+',\'800\',\'500\')" class="ml-5" style="text-decoration:none"><i class="Hui-iconfont">&#xe6df;</i></a> ';
                            html += '<a title="删除" href="javascript:;" onclick="member_del(this,'+data+')" class="ml-5" style="text-decoration:none"><i class="Hui-iconfont">&#xe6e2;</i></a>';
                            if(parseInt(row.status) === 0){
                                html += '&nbsp;&nbsp;<a style="text-decoration:none" onClick="member_access(this,'+data+')" href="javascript:;" title="通过">通过审核</a>';
                            }
                            return html;
                        },
                        "targets" : 6
                    }
                ]
            };
            dataTbalesInit($('#memberTable'),config,ajaxOp);
        }
        /*用户-添加*/
        function member_add(title,w,h){
            var url = "{{ URL::to('admin/member/addMember') }}";
            layer_show(title,url,w,h);
        }
        /*用户-通过*/
        function member_access(obj,id){
            layer.confirm('确认通过审核吗？',function(index){
                $.ajax({
                    type: 'POST',
                    url: '{{ URL::to('admin/member/accessMember') }}',
                    data : {
                      id: id
                    },
                    dataType: 'json',
                    success: function(ret){
                        if(ret.code == 1){
                            layer.msg(ret.msg,{icon: 6,time:1000});
                            $(obj).remove();
                        }else{
                            layer.msg(ret.msg,{icon: 6,time:1000});
                        }
                    },
                    error:function(data) {
                        console.log(data.msg);
                    },
                });
            });
        }
        /*用户-编辑*/
        function member_edit(title,id,w,h){
            var url = '{{ URL::to('admin/member/editMember') }}'+'/'+id;
            layer_show(title,url,w,h);
        }
        /*用户-删除*/
        function member_del(obj,id){
            layer.confirm('确认要删除吗？',function(index){
                $.ajax({
                    type: 'POST',
                    url: '{{ URL::to('admin/member/delMember') }}',
                    data : {
                        id : id
                    },
                    dataType: 'json',
                    success: function(ret){
                        if(ret.code == 1){
                            $(obj).parents("tr").remove();
                            layer.msg(ret.msg,{icon:1,time:1000});
                        }else{
                            layer.msg(ret.msg,{icon:1,time:1000});
                        }
                    },
                    error:function(data) {
                        console.log(data.msg);
                    },
                });
            });
        }
    </script>
@endsection